<template>
	<view>
		<view class="doubleCoupons">
			<view class="couponHead">
				<image src="/static/images/h.png"></image>
				<text class="couponTitle">优惠劵</text>
				<text>先到先得,赶紧抢货</text>
			</view>
			<view class="couponFoot">
				<view class="couponItem">
					<view class="itemImg"><image src="/static/images/coupon1.png"></image></view>

					<view class="itemDetail">
						<view class="itemCheap">100元可买150元券</view>
						<view class="severalfold">1.5倍优惠劵</view>
						<view class="itemPrice">
							<text>￥</text>
							<text>100</text>
							<text>￥150</text>
						</view>
						<view class="itemShop">已抢6644件</view>
						<view class="rightAway">马上抢购</view>
					</view>
				</view>
				<view class="couponItem">
					<view class="itemImg"><image src="/static/images/coupon1.png"></image></view>

					<view class="itemDetail">
						<view class="itemCheap">100元可买150元券</view>
						<view class="severalfold">1.5倍优惠劵</view>
						<view class="itemPrice">
							<text>￥</text>
							<text>100</text>
							<text>￥150</text>
						</view>
						<view class="itemShop">已抢6644件</view>
						<view class="rightAway" @click="openDy">马上抢购</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	methods: {
		openDy() {
			plus.runtime.openURL('snssdk1128://user/profile/id?refer=web&gd_label=click_wap_profile_follow&type=need_follow&needlaunchlog=1', function(res) {
				console.log(res);
			});
		}
	}
};
</script>

<style lang="less">
.doubleCoupons {
	margin: 0 25rpx 20rpx;
	.couponHead {
		margin: 0 auto 20rpx;
		width: 690rpx;
		image {
			width: 24rpx;
			height: 30rpx;
			vertical-align: middle;
		}
		text {
			vertical-align: middle;
			font-size: 22rpx;
			font-weight: 500;
			color: #333333;
		}
		.couponTitle {
			margin: 0 10rpx;
			font-size: 30rpx;
			font-weight: bold;
			color: #333333;
		}
	}

	.couponFoot {
		.couponItem {
			position: relative;
			display: flex;
			align-items: center;
			margin-bottom: 20rpx;
			.itemImg {
				width: 194rpx;
				height: 170rpx;
				margin-right: 25rpx;
				image {
					width: 100%;
					height: 100%;
				}
			}
			.itemDetail {
				.itemCheap {
					font-size: 28rpx;
					font-weight: bold;
					color: #343434;
				}
				.severalfold {
					font-size: 22rpx;
					font-weight: 500;
					color: #808080;
				}
				.itemPrice {
					margin-top: 10rpx;
					text {
						color: #eb3c4a;
						font-size: 22rpx;
					}
					text:nth-child(2) {
						font-size: 35rpx;
						color: #eb3c4a;
					}
					text:last-child {
						text-decoration: line-through;
						color: #808080;
						font-size: 22rpx;
					}
				}
				.itemShop {
					margin-top: 10rpx;
					font-size: 22rpx;
					color: #808080;
				}
				.rightAway {
					position: absolute;
					bottom: 35rpx;
					right: 30rpx;
					width: 129rpx;
					height: 57rpx;
					background: #df4c44;
					border-radius: 4rpx;
					font-size: 26rpx;
					font-weight: bold;
					color: #ffffff;
					text-align: center;
					line-height: 57rpx;
				}
			}
		}
	}
}
</style>
